<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum=1.0,minimum-scale=1.0,user-scalable=0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="">
    <script src=""></script>
    <style>
        html {
            font-size: 100px;
        }

        * {
            margin: 0;
            padding: 0;
            font-size: 0.16rem;
        }

        .max {
            width: 100vw;
            height: 15.8rem;
            background-color: #F5F5F5;
        }

        .head-title {
            width: 100vw;
            height: 0.4rem;
            background-color: #F48A00;
        }

        .img1 {
            height: 0.4rem;
            margin-left: 0.4rem;
        }

        .img2 {
            height: 0.3rem;

        }

        .wer {
            margin-left: 0.9rem;
            margin-bottom: 0.05rem;
        }

        .www {
            margin-left: 0.2rem;
            margin-bottom: 0.05rem;

        }

        .ban {
            width: 100vw;
            height: 2.5rem;
        }

        .zhao {
            width: 100vw;
            height: 2.4rem;
            position: relative;
        }

        .inp1 {
            position: absolute;
            top: 2rem;
            left: 0.35rem;
            height: 0.3rem;
            width: 80vw;
            border-radius: 0.05rem;
        }

        .fangda {
            width: 0.2rem;
            position: absolute;
            top: 2.08rem;
            left: 0.44rem;
        }

        .er {
            width: 100vw;
            height: 1.2rem;
            background-color: #F48D00;
            display: flex;
            justify-content: space-around;
            margin-top: 0.1rem;
            align-items: center;
        }

        .one {
            width: max-content;
        }

        .one p {
            text-align: center;
            color: white;
        }

        .one img {
            width: 0.7rem;
        }

        .ling2 {
            width: 100vw;

        }

        .banner2 {
            width: 100vw;

        }

        .remen {
            width: 100vw;
            height: 0.6rem;
            background-color: #F48A00;
            margin-top: 0.08rem;
        }

        .remen p:nth-of-type(1) {
            font-size: 0.18rem;
            color: white;
            font-weight: bolder;
            width: max-content;
            margin-left: 0.2rem;

        }

        .men {
            width: max-content;
            height: max-content;
            padding-top: 0.1rem;
        }

        .remen p:nth-of-type(2) {
            font-size: 0.12rem;
            color: white;
            width: max-content;
            margin-left: 0.2rem;
            font-weight: bolder;

        }

        .father {
            width: 100vw;
            border-bottom: 0.02rem solid rgb(220, 220, 220);
            background-color: white;
        }

        .father .son2:nth-of-type(3) {
            border-bottom: 0px;
        }

        .son2 {
            width: 90%;
            height: 1.2rem;
            margin: auto;
            border-bottom: 0.02rem solid red;
            display: flex;
            padding-top: 0.2rem;

        }

        .you img {
            width: 1rem;
        }

        .zuo {
            margin-left: 0.12rem;
        }

        .zuo p:nth-of-type(1) {
            font-weight: bolder;
            font-size: 0.17rem;
        }

        .zuo p:nth-of-type(2) {
            font-size: 0.12rem;
            margin-top: 0.05rem;
        }

        .zuo p:nth-of-type(3) {
            font-size: 0.12rem;
            color: rgb(127, 127, 127);
            margin-top: 0.05rem;

        }

        .zuo p:nth-of-type(4) {
            font-size: 0.14rem;
            margin-top: 0.05rem;

        }

        .span1 {
            font-size: 0.12rem;
            color: orangered;
            margin-left: 0.83rem;
            font-weight: bolder;

        }

        .span2 {
            font-size: 0.12rem;
            color: rgb(127, 127, 127);
            margin-left: 1.08rem;
        }

        p button {
            background-color: rgba(220, 220, 220, 0.619);
            border: 0px;
            font-size: 0.14rem;
            color: #959595;
        }

        .guan {
            border-top: 0.02rem solid rgb(220, 220, 220);
            width: 100vw;
            margin-top: 0.1rem;
            background-color: white;
        }

        .aaaa div {
            width: 50vw;
            text-align: center;
            height: 0.6rem;
            line-height: 0.6rem;
            font-size: 0.2rem;
            color: #959595;
            border-bottom: #F48A00 1px solid;
        }

        .aaaa div:nth-of-type(1) {
            color: #F48A00;
            border-bottom: 2px solid #F48A00;
        }

        .aaaa {
            display: flex;
            width: 100vw;
        }

        .duo {
            width: 100vw;
            /* height: 2rem; */
            display: flex;
            flex-wrap: wrap;
        }

        .duo div {
            width: 50%;
            height: 0.4rem;
            line-height: 0.4rem;
            text-align: center;
            color: #959595;
        }

        .black {
            width: 100vw;
            height: 1.1rem;
            background-color: #363837;
        }

        .beijing {
            width: 90%;
            height: 0.4rem;
            line-height: 0.4rem;
            margin: auto;
            color: rgb(147, 147, 147);
            border-bottom: 1px solid rgb(103, 103, 103);
        }

        .ping {
            width: 90vw;
            margin: auto;
            display: flex;
            margin-top: 0.1rem;
        }

        .ping div {
            width: 50vw;
        }

        .app p {
            color: #959595;
        }

        .dada {
            position: relative;

        }

        .app {
            position: absolute;
            top: 0rem;
            left: 0.45rem;
        }

        .baba {
            position: relative;
        }

        .bpp {
            position: absolute;
            top: 0rem;
            left: 0.45rem;
        }

        .bpp p {
            color: #959595;
        }
    </style>
</head>

<body>
    <div class="max">
        <div class="head-title">
            <img class="img1" src="./image/index/logo.jpg" alt="">
            <img class="img2 wer" src="./image/index/my.jpg" alt="">
            <img class="img2 www" src="./image/index/xiazai.jpg" alt="">
        </div>
        <div class="zhao">
            <img class="ban" src="./image/index/banner.png" alt="">
            <input class="inp1" type="text" placeholder="        输入小区或商圈名开始找房咯！">
            <img class="fangda" src="./image/index/seach.jpg" alt="">
        </div>
        <div class="er">
            <div class="one">
                <img src="./image/index/index_03.png" alt="">
                <p>二手房</p>
            </div>
            <div class="one">
                <img src="./image/index/index_05.png" alt="">
                <p>新房</p>
            </div>
            <div class="one">
                <img src="./image/index/index_07.png" alt="">
                <p>租房</p>
            </div>
            <div class="one">
                <img src="./image/index/index_09.png" alt="">
                <p>卖房</p>
            </div>
        </div>
        <div class="ling2">
            <img class="banner2" src="./image/index/banner2.png" alt="">
        </div>
        <div class="remen">
            <div class="men">
                <p>热门房源</p>
                <p>Hot house</p>
            </div>
        </div>
        <div class="father">
            <div class="son2">
                <div class="you">
                    <img src="./image/index/img1.jpg" alt="">
                </div>
                <div class="zuo">
                    <p>文化部中间层&nbsp;&nbsp;一层带...</p>
                    <p>2室1厅96m³南北 <span class="span1">1105万</span></p>
                    <p>红庙北里<span class="span2">14268元/平</span></p>
                    <p><button>&nbsp;学区房&nbsp;</button> <button>&nbsp;独家&nbsp;</button></p>
                </div>
            </div>
            <div class="son2">
                <div class="you">
                    <img src="./image/index/img2.png" alt="">
                </div>
                <div class="zuo">
                    <p>文化部中间层&nbsp;&nbsp;一层带...</p>
                    <p>2室1厅96m³南北 <span class="span1">1105万</span></p>
                    <p>红庙北里<span class="span2">14268元/平</span></p>
                    <p><button>&nbsp;学区房&nbsp;</button> <button>&nbsp;独家&nbsp;</button>
                        <button>&nbsp;满五唯一&nbsp;</button>
                    </p>
                </div>
            </div>
            <div class="son2">
                <div class="you">
                    <img src="./image/index/img3.png" alt="">
                </div>
                <div class="zuo">
                    <p>文化部中间层&nbsp;&nbsp;一层带...</p>
                    <p>2室1厅96m³南北 <span class="span1">1105万</span></p>
                    <p>红庙北里<span class="span2">14268元/平</span></p>
                    <p><button>&nbsp;地铁房&nbsp;</button> <button>&nbsp;独家&nbsp;</button></p>
                </div>
            </div>
        </div>
        <div class="guan">
            <div class="aaaa">
                <div>热门关注</div>
                <div>友情链接</div>
            </div>
            <div class="duo">
                <div>北京二手价</div>
                <div>北京找房无忧</div>
                <div>北京二手房价</div>
                <div>青年家园</div>
                <div>海淀日租房</div>
                <div>免税房源</div>
                <div>朝阳新房</div>
                <div>满五年唯一免税</div>
            </div>
        </div>
        <div class="black">
            <div class="beijing">北京找房无忧 > 首页</div>
            <div class="ping">
                <div class="dada">
                    <img class="cen" src="./image/index/apple.png" alt="">
                    <div class="app">
                        <p>iPhone</p>
                        <p>客户端</p>
                    </div>
                </div>
                <div class="baba">
                    <img src="./image/index/android.png" alt="">
                    <div class="bpp">
                        <p>Android</p>
                        <p>客户端</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
<html>